HTTP and URL

Index

Overview
URL Components
URL Key Components
Parsing Path And Query Params
More References

A video that accompanies the page is here....

For our purposes, we'll start with these abridged defintions:

URL - an address or location of data (e.g., a web page)
HTTP - Basically an agreement (protocol) about the format to use for internet messages (requests, responses). E.g., it is agreed that HTML is a suitable response format.

Where this agreement is taken care of "behind the scenes" (by web server and web browser)

On this page, we'll identify key URL components for web programming.

URL Components

The five components of a uniform resource locator (url):

⚠️ keep it simple warning -- different sources could use different terminology -- don't get hung up on that.

https://www.abc.com/shapes/rectangle?width=10&height=2#conclusion

Component	Example	Also Called
scheme	https	protocol
host	www.abc.com	server id or domain name
path	/shapes/rectangle	or folder name + web filename
query	width=10&height=2	query params or search params
fragment identifier	conclusion	fragment - often used to "go to" a section heading within a page.

URL Key Components

The path and query are of primary interest to web programmers.

Component Identification

When coding a web server, we are mainly interested in the path and query of the url.

https://www.abc.com/shapes/rectangle?width=10&height=2

Name	Example	Also Called
path	/shapes/rectangle	folder name + web filename
query	width=10&height=2	query params or search params

Path (Example Usage)

The path allows us to determine a route for our processing

Component	Description
/	An empty path "/" might route us to "home" or "index" page processing
/calc	Any other path will drive us to app specific logic

Query (Example Usage)

We use the query as data related to our processing

Component	Description
width=10&height=2	The parameters might provide model values
search=url&results=5	The parameters might tell us to do a search with a max of five results

Parsing Path And Query Params

Head over here to learn the details of node's URL global object.

Or, we can use a simpler "wrapper object" that simplifies the URL object as shown in the following.

Install url-wrapper

After initializing the project, install the "url-wrapper" module shown

> npm install url-wrapper

Importing

Import the wrapper class as shown

UrlWrapper = require('url-wrapper').UrlWrapper;

Constructing

Construct the wrapper as shown (using a request object).

urlWrapper = UrlWrapper.fromRequest(req);

Usage

For the following usage steps, we'll assume we call the server with the URL show.

http://localhost:3000/shapes/rectangle?width=10&height=5

Path

Use the "path" method to get the url path.

path = urlWrapper.path();
//	/shapes/rectangle

Query Params

Use the "query" method to get the query params as a plain object / map.

Then use it as shown.

query = urlWrapper.query();
w = query.width;
//10
h = query['height'];
//2

More References

Beautifully done expo on HTTP by Fredrik Oseberg

Introduction To Node.js (Chapter 308 - Http)

< HTTP and URL >

Search Site Home Back To Top